<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%  
response.setHeader("Access-Control-Allow-Origin", "*");  
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="referrer" content="no-referrer" />
	<title>器官芯片·数据工厂</title>
	<link href="${pageContext.request.contextPath }/img/webLogoIcon.png" rel="shortcut icon">
    <link href="${pageContext.request.contextPath }/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/font-awesome.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/animate.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/css/style.css" rel="stylesheet">
    <!-- FooTable -->
    <link href="${pageContext.request.contextPath }/css/footable.core.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath}/css/mypage.css" rel="stylesheet">
</head>
<style>
.ti{
	color:#333333;
}
.str{
	color:#252323d4;
}
.search-result p{
	margin-bottom:7px;
}
.right-pic{
	float:right;
	min-height: 140px;
	margin-right: 60px;
	margin-top:15px;
}

ul {
    list-style: none;
    list-style-image: none;
    margin: 0;
    padding: 0;
}

.dn-result-box {
    padding: 20px;
    border-top: 1px solid #f5f5f5;
}

li {
    color: inherit;
    font-size: inherit;
}
.dn-result>p:first-child, .dn-result-word>p:first-child, .dn-result>p:first-child>a, .dn-result-word>p:first-child>a {
    font-size: 20px;
    color: var(--main-color);
}

.dn-result {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: rgba(0,0,0,.1) 1px dashed;
}

#list p {
    margin: 0;
    padding: 0;
}

#list p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
.dn-result>p, .dn-result-word>p {
    margin-bottom: 5px;
}
#list{
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}

</style>
<body>
    <div id="wrapper">
        <nav class="navbar-default navbar-static-side" role="navigation">
            <%@include file="../components/left.jsp"%>
        </nav>
        <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom" style="margin-bottom: 20px;">
		<jsp:include page="../components/head.jsp" flush="true" />
        </div>
        <div class="row wrapper border-bottom white-bg page-heading">
            <div class="col-lg-9">
                <h2>${webName }</h2>
                <ol class="breadcrumb">
                	<li class="nav-main1">
                		<a href="${pageContext.request.contextPath}/admin/tosystem_overview">主页</a>
                	</li>
                	<li class="nav-main2" >
                		<a id="navigation1" href="#" >器官芯片</a>
                	</li>
                	<li class="active">
                		<span>${webName }</span>
                	</li>
               	</ol>
            </div>
        </div>
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-lg-12">
                <div class="ibox float-e-margins" id="dataInfoLine"></div>
                    <div class="ibox float-e-margins">
                        <div class="ibox-content">
                        <div class="input-select" style="margin-bottom: 20px">
	                               		<div class="input-selectbox">
                                            <button data-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button"  aria-expanded="false">
                                            <i class="fa fa-bars"></i>
                                            <span id="inputSelected">全部</span></button>
                                            <ul class="dropdown-menu" id="selectlist">
                                            	<li><a onclick="setselect(this)">全部</a></li>
                                                <li><a onclick="setselect(this)">标题</a></li>
                                                <li><a onclick="setselect(this)">正文</a></li>
                                            </ul>
	                                        <input type="text" class="form-control" style="width:440px;padding-right: 42px;">
	                                        <i id="gosearch" class="fa fa-search cursearch" onclick="search()"></i>
	                                    </div>
	                                </div>
                            <div class="row m-t-sm">
                                <div class="col-lg-12">
                                <div class="panel blank-panel">
                                <div class="panel-body">
                                <div class="tab-content">
                                <div class="tab-pane active" id="tab-1">
                                    	
                                    <div class="feed-activity-list" id="active">
                                    	<ul class="dn-result-box" id="list">
                                    	
                                    	</ul>
                                    </div>
                                     <div class="feed-activity-list" id="logs">
                                    	<div class="box" id="box" style="float: right;"></div>
                                    </div>
                                </div>
                                </div>
                                </div>
                                </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
        </div>
		<jsp:include page="../components/footer.jsp" flush="true" />
        </div>
        </div>
    <!-- Mainly scripts -->
    <script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
    <script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
    <script src="${pageContext.request.contextPath }/js/jquery.metisMenu.js"></script>
    <script src="${pageContext.request.contextPath }/js/jquery.slimscroll.min.js"></script>
    <!-- Custom and plugin javascript -->
    <script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
    <script src="${pageContext.request.contextPath }/js/pace.min.js"></script>
    <!-- FooTable -->
    <script src="${pageContext.request.contextPath }/js/footable.all.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/mypage.js"></script>
    <!-- Page-Level Scripts -->
  	<script src="${pageContext.request.contextPath}/js/anychart-base.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/userCustom.js"></script>
    <script>

        $(document).ready(function() {
        	var data=${nowArray};
            createLine("GSA",1,data);
            $('.footable').footable();
        });
        
    $(function(){
        	thesisnlist(1);
		});
         
        var time = ''
        
        function timeseek(obj) {
        	time = $(obj).val()
        	thesisnlist(1)
		}
        
      
        
		function thesisnlist(pageNum){
        	$.ajax({
        		url : "${pageContext.request.contextPath}/organChip/GSA-data",
        		type : "post",
        		data:{
        			pageNum: pageNum,
        		},
        		success : function(res1) {
        			$('#list').html('')
        			let res=JSON.parse(res1);
        			if (res.page_count > 500) {
        				res.page_count = 500;
					}
        			paging(res.count, res.page_count, pageNum)
        			let list=res.news;
        			console.log(list);
        			for(var i=0;i<list.length;i++){
        				
        				let source=list[i]._source;
        				var department=source.department;
        				var id=source.article_public_id;
        				var status=source.status;
        				if(typeof status=="undefined"){
        					status="";
        				}
        				if(typeof id=="undefined"){
        					id="";
        				}
        				if(typeof department=="undefined"){
        					department="";
        				}
        				var experiment_type=source.experiment_type;
        				if(typeof experiment_type=="undefined"){
        					experiment_type="";
        				}
        				var overall_design=source.overall_design;
        				if(typeof overall_design=="undefined"){
        					overall_design="";
        				}
        				var organization_name=source.organization_name;
        				if(typeof organization_name=="undefined"){
        					organization_name="";
        				}
        				var og=source.organism;
        				var smhtml='';
        				if(typeof og!="undefined"){
        					let organism=JSON.parse(source.organism);
        					for(var y=0;y<organism.length;y++){
            					smhtml='<p style="color: black;"><strong>Organism:&nbsp</strong>'+'<a target="_blank" href="'+organism[y].url+'">'+organism[y].name+'</a>'+'</p>'
            				}
        				}
        				
        				let summary=source.summary;
        				if(typeof summary=="undefined"){
        					summary="";
        				}else{
        					if(summary.length>300){
            					summary=summary.substring(0, 300) + '......';
            				}	
        				}
        				
        				
        				var html='<li class="dn-result">'
        								+'<p style="color: black;"><a style="font-weight:600" target="_blank" href="${pageContext.request.contextPath}/organChip/GSAdetail?article_public_id='+source.article_public_id+'">'+id+'</a></p>'
        								+'<p style="color: black;"><strong>Status:&nbsp</strong>'+status+'</p>'
        								+'<p style="color: black;"><strong>Title:&nbsp</strong>'+source.title+'</p>'
        								+smhtml
        								+'<p style="color: black;"><strong>Experiment Type:&nbsp</strong>'+experiment_type+'</p>'
        								+'<p style="color: black;"><strong>Summary:&nbsp</strong>'+summary+'</p>'
        								+'<p style="color: black;"><strong>Overall Design:&nbsp</strong>'+overall_design+'</p>'
        								+'<p style="color: black;"><strong>Organization Name:&nbsp</strong>'+organization_name+'</p>'
        								+'<p style="color: black;"><strong>Department:&nbsp</strong>'+department+'</p>'
        						'</li>';
        				
        				$('#list').append(html)
        			}
        			
        		},
        		error: function(res) {
        			$('#list').html('<div class="feed-element">暂无数据！</div>')
        		}
        	});
        }
		
        function paging(totalData,totalPage, pagenum) {
			$('#box').paging({
				initPageNo : pagenum, // 初始页码
				totalPages : totalPage, //总页数
				totalCount : '合计' + totalData + '条数据', // 条目总数
				slideSpeed : 600, // 缓动速度 单位毫秒
				jump : true, //是否支持跳转
				callback : function(page) { // 回调函数 
					}
			});
		}
        
		function JumpToPage(pageNum) {
			thesisnlist(pageNum)
		}
		
		//跑马灯方法 
// 		 function init(){
// 			    //获取标题
// 			    var title=document.title;
// 			    //分割字符串--->字符数组
// 			    var arr=title.split("");
// 			    //删除第一个元素并返回该元素
// 			    var e=arr.shift();
// 			    //把一个对象添加到数组末尾
// 			    arr.push(e);
// 			    //把数组转换成字符串
// 			    var marquee=arr.join("");
// 			    //返回给浏览器
// 			    document.title=marquee;
// 			    //定时一直执行
// 			    window.setTimeout("init()",1000);
// 			}
// 			window.onload=init;
    </script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
</body>
</html>
